<nav class="col-md-2 d-none d-md-block bg-light sidebar">
    <div class="sidebar-sticky">
        <ul class="nav flex-column m-auto">

            <h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-2 mb-2 text-muted">
                <span>人群密度</span>
            </h6>
            <ul class="nav flex-column mb-1">
                <li class="nav-item">
                    <a id="0" class="nav-link" href="heatmap.html">
                        <i data-feather="compass"></i>
                        热力图
                    </a>
                </li>
            </ul>

            <ul class="nav flex-column mb-1">
                <li class="nav-item">
                    <a id="7" class="nav-link" href="beebox.html">
                        <i data-feather="hexagon"></i>
                        蜂巢图
                    </a>
                </li>
            </ul>

            <h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-2 mb-2 text-muted">
                <span>出行分析</span>
            </h6>
            <ul class="nav flex-column mb-1">
                <li class="nav-item">
                    <a id="1" class="nav-link" href="amount.html">
                        <i data-feather="anchor"></i>
                        出行方式统计
                    </a>
                </li>
                <li class="nav-item">
                    <a id="2" class="nav-link" href="move-type.html">
                        <i data-feather="pie-chart"></i>
                        出行方式分析
                    </a>
                </li>
                <li class="nav-item">
                    <a id="3" class="nav-link" href="move_count_forecast.html">
                        <i data-feather="activity"></i>
                        出行人数预测
                    </a>
                </li>
                <li class="nav-item">
                    <a id="8" class="nav-link" href="bar-label-rotation.html">
                        <i data-feather="activity"></i>
                        驻留情况
                    </a>
                </li>
            </ul>

            <h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-2 mb-2 text-muted">
                <span>异常聚集可视化</span>
            </h6>
            <ul class="nav flex-column mb-1">
                <li class="nav-item">
                    <a id="4" class="nav-link" href="juJiDian.html">
                        <i data-feather="bar-chart-2"></i>
                        异常聚集点
                    </a>
                </li>
            </ul>

            <h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-2 mb-2 text-muted">
                <span>基站区域聚类分析</span>
            </h6>
            <ul class="nav flex-column mb-1">
                <li class="nav-item">
                    <a id="5" class="nav-link" href="cluster_pixels.html">
                        <i data-feather="grid"></i>
                        像素图
                    </a>
                </li>
                <li class="nav-item">
                    <a id="6" class="nav-link" href="cluster_points.html">
                        <i data-feather="map-pin"></i>
                        点图
                    </a>
                </li>
            </ul>
        </ul>
    </div>
</nav>
<script>feather.replace()</script>
<script>
    $(document).ready(function () {
        if ($('title').html() == "热力图") {
            $('#0').css("color", "black");
        } else if ($('title').html() == "出行方式统计") {
            $('#1').css("color", "black");
        } else if ($('title').html() == "出行方式分析") {
            $('#2').css("color", "black");
        } else if ($('title').html() == "出行人数预测") {
            $('#3').css("color", "black");
        } else if ($('title').html() == "异常聚集可视化-聚集点") {
            $('#4').css("color", "black");
        } else if ($('title').html() == "聚类-像素图") {
            $('#5').css("color", "black");
        } else if ($('title').html() == "聚类-点图") {
            $('#6').css("color", "black");
        } else if ($('title').html() == "蜂巢图") {
            $('#7').css("color", "black");
        } else if ($('title').html() == "驻留情况") {
            $('#8').css("color", "black");
        }
    });
</script>